<template>
  <div>
    <search></search>
    <tabTop @checked-switch="CheckedSwitch" :leftshopList="leftshopList" :centershopList="centershopList" :rightshopList="rightshopList">
      <span v-if="leftshopList.length != 0" slot="left">
        <!-- 订单列表 -->
        <shopcar :leftshopList="leftshopList" :mytype="mytype">
        </shopcar>
      </span>
      <span v-if="centershopList.length != 0" slot="center">
        <shopcar :centershopList="centershopList" :mytype="mytype">
         
        </shopcar>
      </span>
      <span v-if="rightshopList.length != 0" slot="right"> 
        <shopcar :rightshopList="rightshopList" :mytype="mytype">
          
        </shopcar> </span>
    </tabTop>
  </div>
</template>
<script>
import tabTop from "@/components/tab/tabTop.vue";
import shopcar from "@/components/tab/shopcar.vue";
import search from "@/components/search/search.vue";
import { GetOrderAllMes } from "@/network/order/order.js";
export default {
  name: "home",
  components: {
    search,
    tabTop,
    shopcar,
  },
  data() {
    return {
      leftshopList: [],
      centershopList: [],
      rightshopList: [],
      mytype:0
    };
  },
  //生命周期 - 创建完成（访问当前this实例）
  activated() {
    this.CheckedSwitch(this.$route.query.type * 1); 
  },
  created() {
    this.CheckedSwitch(this.$route.query.type * 1); 
  },
  methods: {
    async CheckedSwitch(type) {
      const { data: res } = await GetOrderAllMes();
       this.leftshopList = res.list.filter((v) =>v.paystatus==0);//未支付
       this.centershopList = res.list.filter((v) =>v.paystatus==1);
       this.rightshopList = res.list.filter((v) =>v.paystatus==2);
       this.mytype=type
        //console.log(this.centershopList)
      // console.log(type);
    },
  },
};
</script>
<style scoped lang="less">
@import "../assets/css/index.less";
</style>